<%--
  Created by IntelliJ IDEA.
  User: BHT
  Date: 2022/12/8 0008
  Time: 23:44:01
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css.css">
    <link rel="stylesheet" href="iconfont/iconfont.css">
    <script src="jquery-3.5.1.min.js"></script>
    <title>login</title>
</head>

<body>
<div class="main">
    <h2 class="title">用户管理系统</h2>
    <div class="mainItem">
        <div class="mainLogin">
            <div class="user" id="user">
                <form action="${pageContext.request.contextPath}/adminLoginServlet" method="post">
                <div class="change" id="change">切换注册</div>
                <h2>
                    <img src="img/man.webp" alt="" style="width: 70px;height: 70px;margin-left:170px ">
                </h2>
                <div class="text">
                    <div class="div1">
                        <i class="iconfont icon-yonghu users"></i>
                        <input type="text" name="username2" placeholder="账号">
                    </div>
                </div>
                <div class="text">
                    <div class="div1">
                        <i class="iconfont icon-mima users"></i>
                        <input type="password" name="password2" placeholder="密码">
                    </div>
                </div>
                <div class="text sub" >
                    <input type="submit" value="登录">
                </div>
                </form>
            </div>
            <div class="user" id="user2">
                <form action="${pageContext.request.contextPath}/adminAddServlet" method="post">
                <div class="change change2">切换登录</div>
                <h2>
                    <img src="img/man.webp" alt="" style="width: 70px;height: 70px;margin-left:170px ">
                </h2>
                <div class="text">
                    <div class="div1">
                        <i class="iconfont icon-yonghu users"></i>
                        <input type="text" name="username" placeholder="账号">
                    </div>
                </div>
                <div class="text">
                    <div class="div1">
                        <i class="iconfont icon-mima users"></i>
                        <input type="password" name="password" placeholder="密码">
                    </div>
                </div>
                <div class="text sub" >
                    <input type="submit" value="注册">
                </div>
                </form>
            </div>

        </div>
        <div class="mainImgLeft">
            <img src="img/imac.png" alt="">
        </div>
    </div>
</div>
</body>
<script>
    $('#change').click(function () {
        $('#user').css({
            transform: 'translate(-' + 10 + '%,' + '-' + 50 + '%)',
            opacity: 0,
            visibility: 'hidden'
        })
        $('#user2').css({
            transform: 'translate(' + 45 + '%,' + '-' + 50 + '%)',
            opacity: 1,
            visibility: 'visible',
            zIndex: 999
        })
        $('.main').css({
            background: 'url(img/bg_1.jpg) no-repeat'
        })
    })
    $('.change2').click(function () {
        $('#user').css({
            transform: 'translate(' + 10 + '%,' + '-' + 50 + '%)',
            opacity:1,
            visibility:'visible'
        })
        $('#user2').css({
            transform: 'translate(' + 70 + '%,' + '-' + 50 + '%)',
            opacity: 0,
            visibility: 'hidden',
            zIndex: 1
        })
        $('.main').css({
            background: 'url(img/bg_3.jpg) no-repeat'
        })
    })
</script>

</html>